import 'package:flutter/material.dart';
import 'package:flutter_app/views/Loan/detail.dart';

class LoanList extends StatefulWidget {
  LoanList({Key key}) : super(key: key);

  _LoanListState createState() => _LoanListState();
}

class _LoanListState extends State<LoanList> {
  final TextStyle _fieldKey = TextStyle(color: Color(0xFF666666), fontSize: 14);
  final TextStyle _fieldVal = TextStyle(color: Color(0xFF101010), fontSize: 14);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        elevation: 0,
        title: Text('My loans'),
      ),
      body: ListView.builder(
        itemBuilder: (context, index) {
          return _renderSingleLoan(index);
        },
        itemCount: 30,
      ),
      backgroundColor: Color(0xFFF4F5F5),
    );
  }

  GestureDetector _renderSingleLoan(int index) {
    return GestureDetector(
      onTap: viewLoanDetail,
      child: Container(
        width: MediaQuery.of(context).size.width,
        margin: EdgeInsets.only(left: 16, right: 16, top: 8, bottom: 0),
        height: 140,
        child: Card(
          shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.all(Radius.circular(12.0))),
          child: Padding(
            padding: EdgeInsets.only(left: 12, top: 12, right: 12, bottom: 8),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: <Widget>[
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Text('₹ 900.00',
                        style: TextStyle(
                            color: Color(0xFF101010),
                            fontSize: 16,
                            fontWeight: FontWeight.w700)),
                    Container(
                      margin: EdgeInsets.only(right: 14),
                      decoration: BoxDecoration(
                        color: Color(0xFFFFF4F5),
                      ),
                      padding: EdgeInsets.symmetric(vertical: 4, horizontal: 8),
                      child: Text(
                        'Overdue',
                        style:
                            TextStyle(color: Color(0xFFFF3446), fontSize: 10),
                      ),
                    )
                  ],
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Text('Amount received', style: _fieldKey),
                    Text('₹ 738.000', style: _fieldVal)
                  ],
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Text('Tenor', style: _fieldKey),
                    Text('14 Days', style: _fieldVal)
                  ],
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Text('Loan date', style: _fieldKey),
                    Text('2019-01-22', style: _fieldVal)
                  ],
                )
              ],
            ),
          ),
        ),
      ),
    );
  }

  void viewLoanDetail() {
    Navigator.of(context)
        .push(MaterialPageRoute(builder: (BuildContext context) {
      return LoanDetail();
    }));
  }
}
